<template>
  <view>
    <web-view :webview-styles="webviewStyles"
              :src="url"
              @message="handlerMessage"
              @onPostMessage="onPostMessage"
              ref="webview"></web-view>
  </view>
</template>

<script setup>

import {ref} from "vue";
import {onLoad} from "@dcloudio/uni-app";
import {useUserInfoStore} from "../../stores/modules/userInfo";
import {useCommonInfoStore} from "../../stores/modules/commonInfo";

const userInfoStore = useUserInfoStore()
const commonInfoStore = useCommonInfoStore()

const url = ref()
const webviewStyles = ref({
  progress: {
    color: '#FECC32'
  }
})
onLoad((opt) => {
  if (opt.type === 1) {
    url.value = opt.url
    return
  }
  uni.setNavigationBarColor({
    frontColor: '#000000', // 前景色值，包括按钮、标题、状态栏的颜色
    backgroundColor: '#ffffff', // 背景颜色值
    animation: { // 动画效果
      duration: 400,
      timingFunc: 'easeIn'
    }
  });
  const city = commonInfoStore.addressDel.city
  console.log(['opt', opt])
  const userId = userInfoStore.userInfo?.id
  url.value = `${opt.url}?userId=${userId}&city=${city}`
  console.log('url.value', url.value)
})
const onPostMessage = (e) => {
  console.log('快来onPostMessage---------')
  console.log('webview的', e)
  console.log('webview的webview', webview.value)
  uni.showToast({title: "onPostMessage" + e, icon: "none", duration: 3000})
}
const webview = ref()
const handlerMessage = (e) => {
  uni.navigateBack()
  console.log('快来handlerMessage---------')
  console.log('webview的', e)
  console.log('webview的webview', webview.value)
  uni.showToast({title: "handlerMessage" + e, icon: "none", duration: 3000})
}
</script>

<style>

</style>
